<template>
    <div class="second_level_page exchange_code_page">
        
        <input type="text" name="money" placeholder="请输入兑换凭证码" v-model="message">
        <div @click="submitThing" class="submit_btn">提交</div>
        <alert-tip v-if="showAlert" @closeTip="closeTip" :alertText="alertText"></alert-tip>     
    </div>
</template>


<script src="https://unpkg.com/vue-amap/dist/index.js"></script>


<script>
    import {mapState, mapMutations} from 'vuex'
    import {bindVoucher} from 'src/service/getData'
    import alertTip from 'src/components/common/alertTip'

    export default {
      data(){
            return{
    			memberId:'',
                voucherCode:'',
                message:'',
                showAlert: false,
                alertText: '',
                tipType: 0,
            }
        },
        created(){

        },
        mounted(){          
            this.memberId = this.$route.query.memberId;
            this.voucherCode = this.$route.query.voucherCode;
        },
        components: {  
            alertTip,
        },
        computed:{
             ...mapState([
                'userInfo'
            ]),
        },
        methods: {
            async submitThing() {
                if(this.message) {
                    let res = await bindVoucher(this.userInfo.token, this.memberId,this.voucherCode,this.message);
                    this.showAlert = true;
                    this.alertText = res.resultMessage;
                    if (res.resultCode==200){
                        this.tipType = 1;
                    }else{
                        this.tipType = 0;
                    }
                } else {
                    this.showAlert = true;
                    this.alertText = "兑换码不能为空!";
                    this.tipType = 0;
                }            
            },
            closeTip(){
                this.showAlert = false;
                if(this.tipType == 1){
                    this.$router.go(-1);
                }
            },
        }
    }
</script>
  
<style lang="scss" scoped>
    @import 'src/style/mixin';

    .exchange_code_page{
        background: #fff;
        input{
            @include wh(80%, 1.28rem);
            margin: 0 auto;
            display: block;
            text-align: center;
            padding: .39rem 0;
            line-height: .5rem;
            @include sc(.32rem, #333);
        }
        .submit_btn{
            margin: .42rem .26rem;
            height: .88rem;
            line-height: .88rem;
            text-align:center;
            background: $orange;
            border-radius: .1rem;
            @include sc(.34rem, #fff);
        }
    }   
</style>
